<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
    <title>WORD转PPT</title>
    <link rel="stylesheet" href="../../../css/mui.min.css" />
    <script src="../../../js/mui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../../../css/app.css" />
    <link rel="stylesheet" href="../../../npl/css/vant.mini.css" />
    <script src="../../../js/jquery-3.6.0.min.js"></script>
    <script src="../../../js/flexible.js"></script>
    <script src="../../../js/vue.js"></script>
    <script src="../../../js/sm2.js"></script>
    <script src="../../../js/sm3.js"></script>
    <script src="../../../js/clipboard.js"></script>
    <script src="../../../npl/js/vant.mini.js"></script>
    <script src="../../../js/vconsole.min.js"></script>
    <script src="../../text.js" type="text/javascript"></script>

    <link rel="stylesheet" href="../css/github-markdown.css" />
    <link rel="stylesheet" href="../css/ppt.css" />
    <link rel="stylesheet" href="../css/minutes.css" />
    <link rel="stylesheet" href="../css/chooseDir.css" />
    <!-- <link rel="stylesheet" href="../js/bootstrap/bootstrap.min.css" /> -->

    <script src="../js/marked.min.js" type="text/javascript"></script>
    <script src="../js/turndown.js" type="text/javascript"></script>
    <script src="../js/util.js" type="text/javascript"></script>
    <script src="../js/stream.js"></script>
    <script src="../js/streamMsg.js"></script>
    <script src="../js/multiBtn.js"></script>
    <script src="../js/chooseDir.js"></script>

    <style scoped>

    </style>
</head>

<body class="program-body">
    <div id="app" v-cloak>
        <multi-btn :changeable="changeMultiBtn"></multi-btn>
        <choose-dir ref="chooseDirRef" @choose-dir-upload="chooseDirUpload"></choose-dir>
        <div class="is-loading">
            <div class="curtain">
                <div class="loadingBgc">
                    <div class="loader"></div>
                </div>
            </div>
        </div>
        <div class="trainTickets program-main" style="height: calc(100% - 20px)">
            <div class="header_tit" style="height: 100%;">
                <van-nav-bar title="WORD转PPT" :border=false left-arrow>
                    <template #left>
                        <div class="back_l" @click="home()">
                            <img src="../../../image/left.png" alt="" />
                        </div>
                    </template>
                </van-nav-bar>
                <!-- 生成大纲 -->
                <div v-if="currentStep == 1" class="step1">
                    <!-- 主题 -->
                    <div class="material-need" style="padding-top: 10px;">
                        <div class="field-label">
                            <span class="tit_text">上传文档<span class="first_span_img">*</span></span><span class="max-tip">（支持50M内带有标题格式的WORD文件）</span>
                        </div>
                        <div class="material">
                            <div class="upload-item" v-if="upLoadFile" @click="chooseUpload(0)">
                                <div class="program-item-left">
                                    <img :src="'../images/' + uploadFileType + '.png' " alt="" />
                                </div>
                                <div class="program-item-right3">
                                    <div class="file-title">
                                        <div class="right-title">{{ fileName }}</div>
                                        <div class="right-desc">{{ uploadFileType.toUpperCase() }}<span style="margin: 0 0.1rem 0 0.1rem;"></span>{{fileSize}}</div>
                                    </div>
                                </div>
                            </div>
                            <div v-if="!upLoadFile" @click="chooseUpload(0)">
                                <!-- <img class="empty-file" src="../images/ppt/pptUploadbg.png" /> -->
                                <div class="upload-prompt">
                                    <img class="upload-prompt-image" src="../images/ppt/ppt-upload.png" />
                                    <span class="prompt-text">点击此处上传文件</span>
                                    <span class="prompt-text2">系统会提取文件的目录作为大纲</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- <div class="ppt-subject" >
                        <div class="field-label">
                            <span class="tit_text">文件标题</span><span class="first_span_img">*</span>
                        </div>
                        <div class="subject-title">
                            <input class="subject-input" placeholder="示例：xxxx项目" v-model="pptForm.title" />
                        </div>
                    </div> -->
                    <div class="model-area">
                        <div class="field-label" style="margin-top: 0.2rem;">
                            <span class="tit_text">选择模板</span><span class="first_span_img">*</span><span class="max-tip">（向左滑动选择更多模板）</span>
                        </div>
                        <div class="gray_text">专用模板</div>
                        <div class="ppt-item-list m-scroll" @scroll="handleSpecialScroll">
                            <div v-for="(item, index) in specialList" :key="index"
                                :class="['ppt-item',pptForm.curModelId == item.id ? 'm-selected':'']" @click="selModel(item)">
                                <img v-if="pptForm.curModelId == item.id ? true : false"
                                    class="m-list-item-radio"  src="../images/write/xuanzhong.png" alt="">
                                <img :src="item.coverUrl" :class="['model-img', pptForm.curModelId == item.id ? 'ppt-model-selected':'']"/>
                            </div>
                        </div>
                        <div class="gray_text" style="margin-top: 0.2rem;">通用模板</div>
                        <div class="ppt-item-list m-scroll" id="general" @scroll="handleGeneralScroll">
                            <div v-for="(item, index) in generalList" :key="index"
                                :class="['ppt-item',pptForm.curModelId == item.id ? 'm-selected':'']" @click="selModel(item)">
                                <img v-if="pptForm.curModelId == item.id ? true : false"
                                    class="m-list-item-radio"  src="../images/write/xuanzhong.png" alt="">
                                <img :src="item.coverUrl" :class="['model-img', pptForm.curModelId == item.id ? 'ppt-model-selected':'']"/>
                            </div>
                        </div>
                    </div>
                    <div class="ppt-model-bottom">
                        <van-button class="ppt-submit-btn" @click="directPpt()">生成PPT文件</van-button>
                    </div>
                </div>

                <!-- 生成方案 -->
                <div v-if="currentStep == 2">
                    <div class="program-result-direct">
                        <div class="program">
                            <div class="program-item" v-if="pptResult.id" @click="preview(pptResult)">
                                <div class="program-item-left" >
                                    <div class="program-item-left-back"></div>
                                </div>
                                <div class="program-item-right">
                                    <div class="right-title">{{ pptResult.name }}</div>
                                    <div class="right-desc">PPT<span
                                            style="margin: 0 0.1rem 0 0.1rem;"></span>{{pptResult.fileSize}}</div>
                                </div>
                            </div>
                            <div class="program-item" v-else>
                                <div class="program-item-left">
                                    <img :src="'../images/ppt.png'" />
                                </div>
                                <div class="program-item-right2">
                                    <img src="../../../image/loading2.gif" />
                                    <div class="loading-tip">文件正在生成中</div>
                                </div>
                            </div>
                            <van-divider
                                :style="{ color: '#999', borderColor: '#999', padding: '0 16px' }"></van-divider>
                                <van-row type="flex" justify="end">
                                    <div class="program-btn">
                                        <van-col v-if="pptResult.id" style="margin-right: 10px;">
                                            <div class="send-mail-back active-brightness" @click="sendMail(pptResult)"></div>
                                        </van-col>
                                        <van-col v-if="pptResult.id" style="margin-right: 10px;">
                                            <div class="sync-back active-brightness" @click="syncToInner(pptResult)"></div>
                                        </van-col>
                                        <van-col v-if="pptResult.id" style="margin-right: 10px;">
                                            <div class="share-back active-brightness" @click="share(pptResult)"></div>
                                        </van-col>
                                    </div>
                                </van-row>
                        </div>
                    </div>
                </div>
            </div>


        </div>
    </div>

    <script src="../js/directPPT.js"></script>
</body>

</html>
